// Events Play Music
// Version = 1.0.13

function eventAudioPlayer(playlist, shuffle = true, controls = {
  playBut: '<a class="player__control-play"><i class="far fa-stop-circle"></i><i class="far fa-play-circle"></i></a>',
  songName: '<span class="player__song-name"></span>',
  injPoint: '.site-menu__wrapper',
  style: '@media (max-width: 600px) {.player__song-name{display:none!important}}\
          .site-menu__wrapper {position: relative}\
          .event-player__controls {position:absolute;left:0;bottom:0;display:inline-flex;align-items:baseline;max-width:70%;overflow:hidden;}\
          .event-player__controls * { margin: 0 5px; }\
          .player__control-play{font-size: 2em; color: #7b68eebd; transition: color 0.7s;}\
          .player__control-play .fa-play-circle, .player__control-play .fa-stop-circle {display:none}\
          .player__control-play[state="play"] .fa-play-circle {display:inline-block}\
          .player__control-play[state="stop"] .fa-stop-circle {display:inline-block}\
          .player__control-play:hover {color: #ff0000a1; cursor: pointer}\
          .player__song-name {display:block;width:100%;transition:all 2s;max-height:25px;user-select:none;font-size:1.2em;opacity:1;}\
          .player__song-name:empty {opacity:0}'
}) {

  let autoplay = localStorage.getItem('event-player__autoplay') || 'true';
  playlist = shuffle ? shuffleArr(playlist) : playlist;

  function playLoop(i, p) {
    p.onended = () => {
      p.src = playlist[i][1];
      p.song_name = playlist[i][0];
      p.play();
      playLoop(playlist[++i] ? i++ : 0, p)
    }
  }
  function addControls(player, opt = {}) {
    let injPoint = document.querySelector(opt.injPoint) || document.querySelector('body'),
      panel = '<div class="event-player__controls">\
      				<style>'+ (opt.style ? opt.style : "") + '</style>\
      				'+ (opt.playBut ? opt.playBut : "") + '\
      				'+ (opt.songName ? opt.songName : "") + '\
      				</div>';
    injPoint.insertAdjacentHTML('afterbegin', panel);
    if (player) {
      // window.player = player; //debug
      player.addEventListener('playing', (e) => {
        //console.log(e.target.song_name);
        document.querySelector('a.player__control-play').setAttribute('state', 'stop');
        document.querySelector('span.player__song-name').innerText = '';
        document.querySelector('span.player__song-name').innerText = e.target.song_name;
      });
      player.addEventListener('pause', (e) => {
        document.querySelector('a.player__control-play').setAttribute('state', 'play');
        document.querySelector('span.player__song-name').innerText = '';
      });
      player.addEventListener('onended', () => document.querySelector('a.player__control-play').setAttribute('state', 'play'));
      document.querySelector('.player__control-play').addEventListener('click', () => {
        if (player.paused) {
          player.play();
          localStorage.setItem('event-player__autoplay', true);
        } else {
          player.pause();
          localStorage.setItem('event-player__autoplay', false);
        }
      });
    }
  }
  if (playlist) {
    let player = new Audio();
    player.src = playlist[0][1];
    player.volume = 0.3;
    player.song_name = playlist[0][0];
    if (autoplay == 'true') {
      player.play();
    }
    playLoop(1, player);
    addControls(player, controls);
    // console.log(autoplay); //debug
    player.paused ? document.querySelector('a.player__control-play').setAttribute('state', 'play') : document.querySelector('a.player__control-play').setAttribute('state', 'stop')
  }
}
export { eventAudioPlayer }